<template>
    <Card>
        <p slot="title">余额变更记录</p>
        <div class="search-con search-con-top">
            订单号：
            <Input v-model="searchData.order_sn" style="width: 200px"></Input>
            用户名称：
            <Input v-model="searchData.user_name" style="width: 200px"></Input>
            变更类型：
            <Select v-model="searchData.type" style="width:200px">
                <Option v-for="(item, index) in typeList" :value="index" :key="index">{{ item }}</Option>
            </Select>
            <Button @click="search" type="primary" shape="circle" icon="ios-search" style="margin-left: 10px;">搜索</Button>
            <Button @click="reset" type="success" shape="circle" icon="ios-refresh" style="margin-left: 10px;">刷新</Button>
        </div>
        <br>
        <Table :columns="columns" :data="list" border>
            <template slot-scope="{ row , index}" slot="typeSlot">
                <p v-show="row.type == 0">直推奖励</p>
                <p v-show="row.type == 1">级差奖励</p>
                <p v-show="row.type == 2">提现扣除</p>
                <p v-show="row.type == 3">提现失败添加</p>
                <p v-show="row.type == 4">管理员增加</p>
                <p v-show="row.type == 5">管理员扣除</p>
            </template>
            <template slot-scope="{ row , index}" slot="memberSlot">
                <i-button type="primary" class="inputMaxWidth" @click="showAddRoleDrawer(row)"
                    v-show="row.order_status == '待发货'">发货</i-button>
            </template>
        </Table>
        <br>
        <Page :total="total" show-sizer show-total show-elevator @on-change="changePage" @on-page-size-change="changeSize">
        </Page>
    </Card>
</template>

<script>
export default {
    name: "techMoneyRecord",
    data() {
        return {
            // 列表
            columns: [
                {
                    title: '订单号',
                    align: "center",
                    key: 'order_sn',
                },
                {
                    title: '名称',
                    align: "center",
                    key: 'username',
                },
                {
                    title: '手机号',
                    align: "center",
                    key: 'mobile',
                },
                {
                    title: '变更类型',
                    align: "center",
                    key: 'remark',
                },
                {
                    title: '金额',
                    align: "center",
                    key: 'amount',
                },
                {
                    title: '变更后',
                    align: "center",
                    key: 'after',
                },
                {
                    title: '创建时间',
                    align: "center",
                    key: 'create_time',
                },
            ],
            // 数据
            list: [],
            total: 0,
            searchData: {
                page: 1,
                limit: 10,
            },
            showAdd: false,
            // 管理信息
            deliveryInfo: {
                id: 0,
                delivery_company: "",
                delivery_no: "",
            },
            typeList: [],
        }
    },
    methods: {
        getList() {
            const param = {
                ...this.searchData
            };
            this.$axios('/admin/finance/coach_money/getList', param).then(res => {
                this.list = res.data;
                this.total = res.total;
            });
        },
        search() {
            this.searchData.page = 1;
            this.getList();
        },
        reset() {
            this.searchData = {
                page: 1,
                limit: 10,
            };
            this.getList();
        },
        changePage(page) {
            this.searchData.page = page;
            this.getList();
        },
        changeSize(size) {
            this.searchData.limit = size;
            this.getList();
        },
        // 显示添加角色弹窗
        showAddRoleDrawer(row) {
            this.showAdd = true;
            this.deliveryInfo.id = row.id
        },
        // 添加角色
        submit() {
            const params = {
                ...this.deliveryInfo
            };
            this.$axios('/admin/product/sendGoods', params).then(res => {
                this.$Message.success('发货成功');
                this.showAdd = false;
                this.getList();
            })
        },
        // 获取类型列表
        getTypeList() {
            this.$axios('/admin/finance/coach_money/getBalanceType').then(res => {
                this.typeList = res;
            });
        },
    },
    created() {
        // 查询自己管理员
        this.getList();
        this.getTypeList();
    }
}
</script>

<style>
.inputMaxWidth {
    max-width: 180px;
    margin-left: 10px;
}
</style>
